<template>
    <div class="app-container" v-loading="loading">
        <div class="contentBox" >
        <!-- 数据列表 -->
        <div title="钻孔取样" v-show="dirllVisible" width="80%">
            <el-tabs tab-position="left">
                <el-tab-pane label="钻孔信息">
                    <el-table :data="dirllDepthData" :height="600">
                        <el-table-column property="locationCode" width="250" label="储罐编号"></el-table-column>
                        <el-table-column property="shortDesc" label="钻孔描述"></el-table-column>
                        <el-table-column property="drillDate" label="钻孔时间"></el-table-column>
                        <el-table-column property="method" label="钻孔方法"></el-table-column>
                        <el-table-column property="equipment" label="钻孔设备"></el-table-column>
                        <el-table-column property="startDepth" label="起点深度"></el-table-column>
                        <el-table-column property="endDepth" label="终点深度"></el-table-column>
                        <el-table-column property="diameter" label="转孔直径"></el-table-column>
                        <el-table-column property="geoMaterial" label="岩土名称"></el-table-column>
                        <el-table-column property="geoType" label="岩土类别"></el-table-column>
                        <el-table-column property="color" label="岩土颜色"></el-table-column>
                        <el-table-column property="compactness" label="岩土密度"></el-table-column>
                        <el-table-column property="moisture" label="岩土湿度"></el-table-column>
                        <el-table-column property="plasticity" label="可塑性"></el-table-column>
                        <el-table-column property="permeability" label="渗透性"></el-table-column>
                    </el-table>
                </el-tab-pane>
                <el-tab-pane label="钻孔数据">
                    <el-table :data="dirllVData" :height="600">
                        <el-table-column property="samplingname" width="320" label="样本编码"></el-table-column>
                        <el-table-column property="sitename" label="点位编码"></el-table-column>
                        <el-table-column property="analysisname" label="分析方法"></el-table-column>
                        <el-table-column property="depths" label="深度"></el-table-column>
                        <el-table-column property="pname" label="要素名称"></el-table-column>
                        <el-table-column property="parametersId" label="要素id"></el-table-column>
                        <el-table-column property="vals" label="要素值"></el-table-column>
                    </el-table>
                </el-tab-pane>
            </el-tabs>
        </div>
        <div title="EM" v-show="EMVisible" width="80%">
            <el-table :data="emData" :height="600">
                <el-table-column property="samplingname" label="样本编码"></el-table-column>
                <el-table-column property="sitename" label="点位编码"></el-table-column>
                <el-table-column property="analysisname" label="分析方法"></el-table-column>
                <el-table-column property="depths" label="深度"></el-table-column>
                <el-table-column property="pname" label="要素名称"></el-table-column>
                <el-table-column property="parametersId" label="要素id"></el-table-column>
                <el-table-column property="vals" label="要素值"></el-table-column>
            </el-table>
        </div>
        
        <div title="监测井" v-show="wellVisible" width="80%">
            <el-table :data="wellData" :height="700">
                <el-table-column property="samplingname" label="样本编码"></el-table-column>
                <el-table-column property="sitename" label="点位编码"></el-table-column>
                <el-table-column property="analysisname" label="分析方法"></el-table-column>
                <el-table-column property="depths" label="深度"></el-table-column>
                <el-table-column property="pname" label="要素名称"></el-table-column>
                <el-table-column property="parametersId" label="要素id"></el-table-column>
                <el-table-column property="vals" label="要素值"></el-table-column>
            </el-table>
        </div>
        <div title="ERT" v-show="ertVisible" width="80%">
            <el-tabs tab-position="left">
                <el-tab-pane label="header信息">
                    <el-table :data="infoData">
                        <el-table-column property="ertName" label="文件名"></el-table-column>
                        <el-table-column property="cableAssignType" label="电缆布置类型"></el-table-column>
                        <el-table-column property="deviceNum" label="设备序列号"></el-table-column>
                        <el-table-column property="deviceType" label="装置类型"></el-table-column>
                        <el-table-column property="electrodeNum" label="电极数"></el-table-column>
                        <el-table-column property="electrodeSpace" label="电极间距"></el-table-column>
                        <el-table-column property="emissionWaveform" label="发射波形"></el-table-column>
                        <el-table-column property="industryHz" label="工业频率"></el-table-column>
                        <el-table-column property="iterationNum" label="迭代次数"></el-table-column>
                        <el-table-column property="latitude" label="纬度"></el-table-column>
                        <el-table-column property="pipelineNum" label="通道数"></el-table-column>
                        <el-table-column property="pointsNum" label="测点数"></el-table-column>
                        <el-table-column property="scriptName" label="脚本名称"></el-table-column>
                        <el-table-column property="scriptType" label="脚本类型"></el-table-column>
                        <el-table-column property="temperature" label="温度"></el-table-column>
                        <el-table-column property="testMethod" label="测试方法"></el-table-column>
                        <el-table-column property="testTime" label="测试时间"></el-table-column>
                        <el-table-column property="weather" label="天气"></el-table-column>
                        <el-table-column property="windPower" label="风力"></el-table-column>
                    </el-table>
                </el-tab-pane>
                <el-tab-pane label="dat信息">
                    <el-table :data="ertDatData">
                        <el-table-column property="acData"  label="A(C1)"></el-table-column>
                        <el-table-column property="mpData" label="M(P1)"></el-table-column>
                        <el-table-column property="npData" label="N(P2)"></el-table-column>
                        <el-table-column property="depth" label="Depth"></el-table-column>
                        <el-table-column property="ima" label="I(mA)"></el-table-column>
                        <el-table-column property="knum" label="K"></el-table-column>
                        <el-table-column property="ro" label="RO"></el-table-column>
                        <el-table-column property="roRd" label="RO_RD"></el-table-column>
                        <el-table-column property="rohm" label="R(ohm)"></el-table-column>
                        <el-table-column property="sp" label="SP"></el-table-column>
                        <el-table-column property="stacking" label="Stacking"></el-table-column>
                        <el-table-column property="sp" label="SP"></el-table-column>
                        <el-table-column property="vmv" label="V(mV)"></el-table-column>
                        <el-table-column property="xnum" label="X"></el-table-column>
                    </el-table>
                     <el-row class="clearfix">
                        <pagination
                            v-show="ertDattotal>0"
                            :total="ertDattotal"
                            :page.sync="ertDatParams.pageNum"
                            :limit.sync="ertDatParams.pageSize"
                            @pagination="getErtDatList"
                        />
                    </el-row>
                </el-tab-pane>
                <el-tab-pane label="GR信息">
                    <el-table :data="ertGrData" >
                        <el-table-column property="electrodeNum"  label="电极编号"></el-table-column>
                        <el-table-column property="testDate" label="测试时间"></el-table-column>
                        <el-table-column property="ground1Status" label="状态一"></el-table-column>
                        <el-table-column property="ground1" label="接地电阻率一"></el-table-column>
                        <el-table-column property="ground2Status" label="状态二"></el-table-column>
                        <el-table-column property="ground2" label="接地电阻率二"></el-table-column>
                    </el-table>
                    <el-row class="clearfix">
                        <pagination
                            v-show="ertGrtotal>0"
                            :total="ertGrtotal"
                            :page.sync="ertGrParams.pageNum"
                            :limit.sync="ertGrParams.pageSize"
                            @pagination="getErtGrList"
                        />
                    </el-row>
                </el-tab-pane>
            </el-tabs>
        </div>
    </div>

    </div>
</template>

<script>
import {getDrillGrid,getEMGrid,getWellGrid,getErtGrid} from "@/api/data/proData"
import {getErtDat,getErtGr,getErtPos} from "@/api/data/proDataForup"
import { saveAs } from 'file-saver'
export default {
    name: 'tableList',
    data() {
        return {
            //加载等待
            loading:true,
            //请求数据
            paramsData:undefined,
            // 钻孔表格弹框
            dirllVisible:false,
            open:false,
            // 钻孔深度表格数据
            dirllDepthData:[],
            dirllVData:[],
            EMVisible:false,
            emData:[],
            wellVisible:false,
            wellData:[],
            ertVisible:false,
            //ERT dat数据
            ertDatData:[],
            //请求参数
            ertDatParams: {
                pageNum: 1,
                pageSize: 50,
                ertId: undefined
            },
            //数目
            ertDattotal:0,
            //ERT gr数据
            ertGrData:[],
            ertGrParams: {
                pageNum: 1,
                pageSize: 50,
                postName: undefined
            },
            ertGrtotal:0,
            //ERT pos数据
            ertPosData:[],
            ertPosParams: {
                pageNum: 1,
                pageSize: 50,
                postName: undefined
            },
            ertPostotal:0,
            infoData:null
        };
    },
    computed: {
    },
    
    watch:{

    },
    mounted() {
        this.paramsData = this.$route.query
        this.infoData = [this.$route.params]
        console.log(this.$route.params)
        let dataType= this.paramsData.dataType;
        let data = this.paramsData 
        if(dataType == '钻孔取样'){
            getDrillGrid(data).then(res=>{
                this.dirllVisible=true
                this.dirllDepthData = res.data.depths
                this.dirllVData =  res.data.vDatas
            })
        }else if(dataType == 'EM'){
            this.EMVisible = true
            this.emData=[]
            getEMGrid(data).then(res=>{
                this.emData = res.data
            })
        }else if(dataType == '监测井取样'){
            this.wellVisible = true
            this.wellData =[]
            getWellGrid(data).then(res=>{
                this.wellData = res.data
            })
        }else if(dataType == 'ERT'){
            this.ertVisible = true
            this.getErtDatList()
            this.getErtGrList()
            // this.getErtPosList()
        }
        this.loading=false
    },

    methods: {
        getErtDatList(){
            this.ertDatParams.ertId = this.paramsData.Id
            getErtDat(this.ertDatParams).then(
                res=>{
                    this.ertDattotal = res.data.total
                    this.ertDatData = res.data.records
                    // console.log(res)
                }
            )
        },
        getErtGrList(){
            this.ertGrParams.ertId = this.paramsData.Id
            getErtGr(this.ertGrParams).then(
                 res=>{
                    this.ertGrtotal = res.data.total
                    this.ertGrData = res.data.records
                    // console.log(res)
                }
            )
        },
        // getErtPosList(){
        //     this.ertPosParams.ertId = this.paramsData.Id
        //     getErtPos(this.ertPosParams).then(
        //          res=>{
        //             this.ertPostotal = res.data.total
        //             this.ertPosData = res.data.records
        //             console.log(res)
        //         }
        //     )
        // },
    },
};
</script>

<style lang="scss" scoped>
.app-container{
    box-sizing: border-box;
    padding: 20px;
    .contentBox{
        background: #fff;
    }
    /deep/ th{
        background: #F1F2F5;
    }
    /deep/ th{
        padding: 0px 0px !important;
    }
    /deep/ .el-table td{
        padding: 0px 0px !important;
    }
}
.imgShow{
    width: 100%;
    height: 100%;
    display:flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: #fff;
    // height: 600px;
    .img{
        width: 100%;
        // 
    }
}
.hear{
    font-size: 18px;
    margin: 10px;

}
</style>